// 图片懒加载功能，必须使用在img标签上
export const installimgLazy = (app) => {
    app.directive('imgLazy', async (el, binding) => {
        // 让图片默认显示一个占位图
        const df = await import('@/assets/logo.svg')
        el.src = df['default']
        // 取得元素可见度
        const observer = new IntersectionObserver((entries) => {
            // 当元素可见时，替换成真实图片
            if(entries[0].isIntersecting){
                el.src = binding.value
                // 取消监听当前元素
                observer.unobserve(el)
            }
        })
        // 要监听的元素
        observer.observe(el)
    })
};
